<template>
	<view class="text-df padding-xs">
		<view class="border-radius-shadow padding-xs" style=" border-radius: 10rpx;">
			<view class="text-bold text-lg margin-bottom-xs">商品信息</view>
			<view class="flex-row padding-xs margin-top-xs" v-for="(item,index) in detail.shop" :key="index">
				<image :src="imgURL+item.indexImg" style="width: 30%; height: 150rpx; border-radius: 15rpx;" class=""
					mode="aspectFill"></image>
				<view class="margin-left-xs" style="width: 70%;">
					<view class="flex-row-bt">
						<view>{{item.productName}}</view>
						<view>￥{{item.monovalent}}</view>
					</view>
					<view class=" margin-top-xs" style="text-align: right;">
						×{{item.num}}
					</view>
				</view>
			</view>
			<view style="color: #D04D44; text-align: right;" class="text-bold margin-bottom-xs">共
				￥{{detail.order.total}}</view>

			<view style="border-top: 2px solid #FDF2F1;" class="flex-row padding-top-xs">
				<view class="flex-row-ct theme-color margin-lr-com iconfont icon-dingwei1" style="font-size: 25px">
				</view>
				<view class="flex-column-st">
					<view class="" type="text">{{detail.address.address}}</view>
					<view class="text-sm text-low " type="text" style="margin-top: 10rpx;">{{detail.address.receiver}}
						{{detail.address.phone}}
					</view>
				</view>
			</view>

		</view>

		<view class=" padding-xs margin-top-sm border-radius-shadow" style=" border-radius: 10rpx;">
			<view class="text-bold text-lg margin-bottom-xs">订单信息</view>

			<view class="padding-xs">
				<view class=" flex-row-bt">
					<view>订单编号：</view>
					<view class="text-low">{{detail.order.outTradeNo}}</view>
				</view>
				<view class=" flex-row-bt margin-top-xs">
					<view>订单创建时间：</view>
					<view class="text-low">{{detail.order.timeStamp}}</view>
				</view>
			</view>

		</view>

	</view>
</template>

<script setup lang="ts">
	import { reactive } from 'vue';
	import {
		onLoad, onShow
	} from '@dcloudio/uni-app'
	import {
		imgURL
	} from '../../api/request';

	const detail = reactive({
		shop: [{
			"id": "1780640338535264256",
			"indexImg": "/profile/product/2024/05/10/下载 (1)_20240510163143A011.jpg",
			"productName": "初动果肉果冻",
			"inventory": 20,
			"monovalent": "31.00",
			"num": 3
		}],
		address: {
			"pkId": "1796429051964547074",
			"userId": "1793129894038286337",
			"address": "萍乡学院",
			"receiver": "曾月星",
			"phone": "18297898672",
			"defaultFlag": null
		},
		order: {
			outTradeNo: null,
			timeStamp: null,
			total: null,
		}
	})

	onLoad((option) => {
		// console.log('跳转参宿和',)
		detail.shop = JSON.parse(option.order).order_list
		detail.address = JSON.parse(option.order).addressMsg
		detail.order.outTradeNo = JSON.parse(option.order).outTradeNo
		detail.order.total = JSON.parse(option.order).total
		detail.order.timeStamp = getNow()
		console.log('11', detail.order.timeStamp)
	})

	const getNow = () => {
		const now = new Date();

		const year = now.getFullYear();
		const month = ('0' + (now.getMonth() + 1)).slice(-2);
		const day = ('0' + now.getDate()).slice(-2);
		const hours = ('0' + now.getHours()).slice(-2);
		const minutes = ('0' + now.getMinutes()).slice(-2);
		const seconds = ('0' + now.getSeconds()).slice(-2);

		const formattedTime = year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds;
		console.log(formattedTime)
		return formattedTime

	}
</script>

<style lang="scss">
	page {
		background-color: #fff;
	}
</style>